import React, { useMemo } from 'react'
import { List } from 'antd-mobile'
import { iconData } from './fontawesomeIcon'

const UseForCard = ({ type, billsList }) => {
	const total = useMemo(() => {
		return billsList.reduce((acc, cur) => acc + cur.money, 0)
	}, [billsList])
	return (
		<>			<List>
				<List.Item
					prefix={iconData[type]}
					extra={total.toFixed(2)}
				>
					{type}
				</List.Item>
			</List >
		</>
	)
}

export default UseForCard